<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>蜗牛商城后台管理系统</title>
</head>
<body>
	<!-- 标题栏 -->
	<jsp:include page="header.jsp"></jsp:include>
	<!-- 导航栏 -->
	<jsp:include page="navbar.jsp"></jsp:include>
	<!-- 数据展示 -->
	<div class="col-md-10 text-center panel" id="view">
		<!-- 展示操作路径 -->
		<div class="panel-heading text-left">
			<a href="welcome.jsp">系统管理</a>-><a href="javascript:void(0)">用户管理</a>
		</div>
		<!-- 面板主体 -->
		<div class="panel-body">
			<!-- 表格 -->
			<table class="table table-bordered table-hover table-striped">
				<!-- 表头 -->
				<thead>
					<tr>
						<th class="text-center">序号</th>
						<th class="text-center">账号</th>
						<th class="text-center">昵称</th>
						<th class="text-center">角色</th>
						<th class="text-center">状态</th>
						<th class="text-center" width="250px">操作</th>
					</tr>
				</thead>
				<!-- 表格主体 -->
				<tbody id="userTB">

				</tbody>
				<tfoot id="userTF">

				</tfoot>
			</table>
		</div>
		<!-- 新增按钮 -->
		<div class="panel-footer">
			<a href="userAdd.jsp" class="btn btn-block btn-info">新增</a>
		</div>
	</div>
	<!-- 版权 -->
	<jsp:include page="footer.jsp"></jsp:include>
</body>
<script type="text/html" id="userTable">
{{each users user}}
	<tr>
		<!-- 序号 -->
		<td>{{(pageBean.page-1)*pageBean.pageSize + $index +1}}</td>
		<!-- 账号 -->
		<td>{{user.uaccount}}</td>
		<!-- 昵称 -->
		<td>{{user.uname}}</td>
		<!-- 角色 -->
		<td>
			{{if user.urole==1}}超级管理员
			{{else if user.urole==2}}普通管理员
			{{else if user.urole==3}}商城用户
			{{/if}}
		</td>
		<!-- 状态 -->
		<td>
			{{if user.ustate==1}}正常
			{{else if user.ustate==2}}禁用
			{{/if}}
		</td>
		<!-- 操作 -->
		<td>
			<button type="button" class="btn btn-sm btn-info" onclick="resetUpsw({{user.uid}})">重置密码</button>
			<!-- 初始管理员账号不可进行下列操作 -->
			{{if user.uid!=1}}
				<!-- 被禁用的用户不可进行下列操作 -->
				{{if user.ustate==1}}
					{{if user.urole==2}}
						<button type="button" class="btn btn-sm btn-primary" onclick="changeUrole({{user.uid}},1)">权限升级</button>
					{{else if user.urole==1}}
						<button type="button" class="btn btn-sm btn-primary" onclick="changeUrole({{user.uid}},2)">权限降级</button>
					{{/if}}
					<button type="button" class="btn btn-sm btn-warning" onclick="changeUstate({{user.uid}},2)">禁用</button>
				<!-- 被禁用的用户可进行解禁操作 -->
				{{else if user.ustate==2}}
					<button type="button" class="btn btn-sm btn-warning" onclick="changeUstate({{user.uid}},1)">解禁</button>
				{{/if}}
			{{/if}}
		</td>
	</tr>
{{/each}}
</script>
<script type="text/html" id="pageBtn">
	<!-- 分页操作按键 -->
	<tr>
		<th colspan="6" class="text-center">
			<button class="btn btn-xs btn-primary" onclick="goPage(1)">首页</button>
			<button class="btn btn-xs btn-primary" onclick="goPage({{page==1?1:page-1}})">上一页</button>
			<button class="btn btn-xs btn-primary" onclick="goPage({{page==totalPage?totalPage:page+1}})">下一页</button>
			<button class="btn btn-xs btn-primary" onclick="goPage({{totalPage}})">末页</button>
			<br> <span>共{{totalPage}}页，现在是第{{page}}页。</span>
		</th>
	</tr>
</script>
<script type="text/javascript">
	let nowPage = 1;
	
	$(document).ready(function() {
		goPage(nowPage);
	})

	//根据页码返回数据;
	function goPage(page) {
		nowPage=page;
		$.ajax({
			url : "../user",
			type : "post",
			data : {
				"opr" : "list",
				"page" : page
			},
			dataType : "JSON",
			success : function(result) {
				if (result.msg == "ok") {
					// 通过模板生成用户信息表					
					let tableHtml = template("userTable", {
						users : result.list,
						pageBean : result.pageBean
					});
					$("#userTB").html(tableHtml);

					// 通过模板生成分页按键表					
					let pageBtnHtml = template("pageBtn", {
						page : result.pageBean.page,
						totalPage : result.pageBean.totalPage
					});
					$("#userTF").html(pageBtnHtml);
				} else {
					alert(result.msg);
				}
			}
		})
	}

	//重置密码
	function resetUpsw(uid) {
		let confirm = window.confirm("重置密码操作不可恢复，您确定要重置吗？");
		if (confirm) {
			$.ajax({
				url : "../user",
				type : "post",
				data : {
					"opr" : "resetUpsw",
					"uid" : uid
				},
				dataType : "JSON",
				success : function(result) {
					if (result.msg == "ok") {
						alert("密码重置成功！");
						goPage(nowPage);
					} else if (result.msg == "null") {
						alert("请重新登录！");
						location.href = "login.jsp";
					} else {
						alert(result.msg);
					}
				}
			})
		}
	}

	//修改用户状态
	function changeUstate(uid, ustate) {
		$.ajax({
			url : "../user",
			method : "post",
			data : {
				"opr" : "changeUstate",
				"uid" : uid,
				"ustate" : ustate
			},
			dataType : "JSON",
			success : function(result) {
				if (result.msg == "ok") {
					alert("状态已修改");
					goPage(nowPage);
				} else if (result.msg == "null") {
					alert("请重新登录！");
					location.href = "login.jsp";
				} else {
					alert(result.msg);
				}
			}
		})
	}

	//修改用户角色
	function changeUrole(uid, urole) {
		$.ajax({
			url : "../user",
			method : "post",
			data : {
				"opr" : "changeUrole",
				"uid" : uid,
				"urole" : urole
			},
			dataType : "JSON",
			success : function(result) {
				if (result.msg == "ok") {
					alert("权限已修改");
					goPage(nowPage);
				} else if (result.msg == "null") {
					alert("请重新登录！");
					location.href = "login.jsp";
				} else {
					alert(result.msg);
				}
			}
		})
	}
</script>
</html>
